{% extends layout %}

{% block content %}
<script>
    var FPH = new FormPageHelper({ModelName:'ContentType',entity: '{{entity|dump(0)|safe}}' });
</script>
<script>
    $(function(){
        var FVSettings ={
            title: {
                row: '.col-sm-6',
                validators: {
                    notEmpty: {
                        message: '标题不能为空'
                    }
                }
            }
        };
        $('.fileupload').change(function(event) {
            if ($('.fileupload').val().length) {
                var fileName = $('.fileupload').val();
                var extension = fileName.substring(fileName.lastIndexOf('.'), fileName.length).toLowerCase();
                if (extension == ".jpg" || extension == ".png") {
                    var data = new FormData();
                    data.append('upload', $('#fileToUpload')[0].files[0]);
                    $.ajax({
                        url: '/apply/upload',
                        type: 'POST',
                        data: data,
                        cache: false,
                        contentType: false, //不可缺参数
                        processData: false, //不可缺参数
                        success: function(data) {
                            $($(".upload-container")[0]).css('background-image',"url("+data.msg+")");
                            //console.log(data);
                            $("input[name='bannerimage']").val(data.msg);
                        },
                        error: function() {
                            console.log('error');
                        }
                    });
                } 
            }
        });
        FPH.initFormValidation(FVSettings);
        FPH.initFormData(null,function(data){
            (data.bannerimage)?$("#bannerImage").css('background-image','url({0})'.format(data.bannerimage)):{};
        });
    });
</script>
<div class="row">
    <div class="col-xs-12">
        <div class="box box-warning">
            <div class="box-header with-border">
                <h3 class="box-title">{% if entity._id %}修改{%else%}新增{%endif%}单页面类别</h3>
            </div>
            <form id="MainForm">
                {% if entity._id %}
                    <input type="hidden" name="_id" />
                {%endif%}
                <div class="box-body">
                    <div class="form-group">
                        <label class="col-sm-12"><span style="color:red;">*</span>类别名称</label>
                        <div class="col-sm-6">
                            <input type="text" name="title" class="form-control">
                        </div>
                        <div class="col-sm-6 error"></div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-12">类别Banner图</label>
                        <div class="col-sm-6">
                            <div class="upload-container" id="bannerImage" >
                                <input type="file" name="fileToUpload" id="fileToUpload" class="fileupload" />
                            </div>
                            <input type="hidden" name="bannerimage" class="form-control">
                        </div>
                        <div class="col-sm-6 error"></div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-12">是否显示</label>
                        <div class="col-sm-6">
                            <select name="display" class="form-control">
                                <option value="true" selected="selected">显示</option>
                                <option value="false" >隐藏</option>
                            </select>
                        </div>
                        <div class="col-sm-6 error"></div>
                    </div>
                    <div class="col-md-12">
                        <input type="button" class="btn btn-danger submit" style="margin-right:30px; width: 60px" value="保存" />
                        <input class="btn btn-default cancel" style="width:60px" type="button" value="返回" />
                    </div>
                    <div class="clearfix"></div>
                </div>
            </form>
        </div>
    </div>
</div>
{% endblock %}